<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

<title>公司年度月份销售额曲线图的数据</title>

<meta http-equiv="pragma" content="no-cache">
<link rel="stylesheet" type="text/css"
	href="${ctx }/resources/easyui/themes/metro/easyui.css">
<link rel="stylesheet" type="text/css"
	href="${ctx }/resources/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="${ctx }/resources/css/wu.css" />
<script type="text/javascript"
	src="${ctx }/resources/easyui/jquery.min.js"></script>
<script type="text/javascript"
	src="${ctx }/resources/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="${ctx }/resources/easyui/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript"
	src="${ctx }/resources/echart/echarts.common.min.js"></script>

</head>

<body>
	<!-- 查询条件开始 -->
	<div class="easyui-panel" data-options="title:'查询条件',iconCls:'icon-search'" style="width:100%;">
		<form id="searchFrm" method="post">
			<table width="100%" cellpadding="10" >
				<tr>
					<td width="100%" align="center">
					 <select id="year" class="easyui-combobox" name="year" label="选择年份:" labelPosition="left" style="width:40%;">
						 <option value="2015">2015</option>
						 <option value="2016">2016</option>
						 <option value="2017">2017</option>
						 <option value="2018">2018</option>
						 <option value="2019">2019</option>
						 <option value="2020">2020</option>
						 <option value="2021">2021</option>
						 <option value="2022">2022</option>
					</select>
					<a href="javascript:void(0)" class="easyui-linkbutton" onclick="doSearch()" data-options="iconCls:'icon-search'">查询</a>
					</td>
				</tr>
			</table>
		</form>
	</div>
	<!-- 查询条件结束 -->
	<div id="container" style="height: 70%"></div>
	<script type="text/javascript">
		var date=new Date();
		var year=date.getFullYear();
		$("#year").val(year);
	
		var dom = document.getElementById("container");
		var myChart = echarts.init(dom);
		var app = {};
		
		
		function doSearch(){
			$.post("${ctx}/tjfx/tjYearMonthLine.action?year="+$("#year").val(),function(obj){
				if(obj!=""){
					option = {
						    title: {
								 text: '公司年度月份销售额曲线图',
								  x : 'center'
							},
						    xAxis: {
						        type: 'category',
						        data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月','八月','九月','十月','十一月','十二月']
						    },
						    tooltip : {
								 trigger: 'axis',
								 axisPointer : {            // 坐标轴指示器，坐标轴触发有效
									 type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
									}
							 },
						    yAxis: {
						        type: 'value'
						    },
						    series: [{
						        data: obj,
						        type: 'line'
						    }]
						};
					myChart.setOption(option, true);
				}else{
					$.messager.alert("提示","查无数据");
				}
			});
		}
		doSearch();
	</script>
</body>
</html>
